<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>
<%@ include file="../../common/layui.jsp" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<head>
    <title>待办的流程</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
</head>
<body>

<!-- 可发起的流程  就是已经部署的流程  -->

<div class="section_mian">
    <!-- 列表页 -->
    <div class="larry-personal">
        <div class="layui-tab">

            <form class="layui-form">
                <table class="layui-table" id="layuitable" lay-filter="tableFilter"></table>
            </form>

        </div>
    </div>
</div>

<script type="text/html" id="toolbar">
    <a class="layui-btn btn_color_zise" lay-event="opencomplete" style="line-height: 25px;height: 25px;">处理</a>
    {{#
    var node = d.nodeId;

    var nodenum = 0 ;
    if(node){
    nodenum = parseInt( node.substring( node.lastIndexOf("_")+1,node.length ) );
    }
    if(    nodenum == 1 )
    {  }}
    <a flag="chang"  class="layui-btn btn_color_hongse" lay-event="unstart" style="line-height: 25px;height: 25px;">取消发起</a>
    {{# } }}

</script>


<script type="text/javascript">
    function  reloadTable() {//刷新表格
        layui.table.reload('layuitable', {   where: {} });
    }
    layui.use(['laypage', 'layer', 'table', 'form', 'laydate'], function () {
        var laypage = layui.laypage
            , layer = layui.layer
            , table = layui.table
            , form = layui.form;
        var where = {};
        table.render({
            url: "flow/db/grid",
            method: 'post', //方式
            elem: '#layuitable', //数据表格渲染到什么位置
            id: 'layuitable', //生成 Layui table 的标识 id 用于操作数据用
            where: where, //默认 参数
            height:500,
            cols: [[
                {checkbox: true},
                {field: "id", title: 'ID', minWidth: 100},
                {field: "startTime", title: '开始时间', minWidth: 100},
                {field: "endTime", title: '结束时间', minWidth: 100},
                {field: "flowId", title: 'flowId', minWidth: 100},
                {field: "nodeId", title: 'nodeId', minWidth: 100},
                {field: "flowDepId", title: '节点图', minWidth: 100},
                {field: "taskId", title: 'taskId', minWidth: 100},
                {field: "nodeName", title: 'nodeName', minWidth: 100},
                {field: "state", title: 'state', minWidth: 100},
                {field: "opt", title: '操作', toolbar: '#toolbar', width: 200}
            ]],
            done: function (res, curr, count) {
                $("[data-field='id']").css('display','none');//隐藏列,[data-field='state']

                 $("[data-field='flowDepId']").children().each(function(){//处理节点名字,流程处于哪个节点
                     var flowDepId = $(this).text();
                     if(flowDepId!="节点图"){
                         //var taskId = $(this).parent().prev().children(0).html();//获取nodeID -01
                         var taskId = $(this).parent().next().children(0).html();//获取 状态
                         $(this).html("<button type='button' class='layui-btn btn_color_zise' onclick='showNodePic(\""+flowDepId+"\",\""+taskId+"\")'>节点图</button>");
                     }

                  });
            },
            page: {layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']}, //是否显示分页栏
            limit: 10

        });
        //监听工具条
        table.on('tool(tableFilter)', function (obj) { //注：tool是工具条事件名，tableFilter是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值
            var tr = obj.tr; //获得当前行 tr 的DOM对象
            var id = data.id;
            var flowId = data.flowId;
            var flowName = data.flowName;
            if (layEvent === 'unstart') { //取消发起
                unstart( flowId,flowName,id );
            }else  if (layEvent === 'opencomplete') { //进入下一环节
                openComplete( flowId,flowName,id );
            }
        });

    });

    function unstart(proId,proName,formId) {

        var flag = false;//防止多次点击
        parent.layer.confirm("确定取消吗", {
            btn : [ '确定', '取消' ]//按钮
        }, function(index) {
            if (flag == true) {//说明执行过了ajax
                return false;//不在执行第二次了
            }
            flag = true;

            $.ajax({
                url: "flow/unstart",
                type: "post",
                cache: false,
                async: false,
                data: {"proId":proId,"proName":proName,"formId":formId},
                dataType: "json",
                success: function (data) {
                  parent.layer.msg('操作成功！', {icon: 1});
                    reloadTable();
                },
                error: function (data) {
                    parent.layer.msg('系统异常！', {icon: 1});
                }
            });




        });
    }



    //进入下一环节
    function  openComplete(proId,proName,formId) {
         parent.layer.open({
             type:2,
             btn: ['关闭'],
             area: ['50%', '80%'],
             skin: 'layui-layer-lan',
             title: "处理"+proName+"流程",
             shade: [0.5, '#393D49'],
             maxmin: true, //开启最大化最小化按钮
             content:"flow/open/complete?proId="+proId+"&proName="+proName+"&formId="+formId,
             yes:function(index,frameDom){
                 //var openFrame = $(frameDom).find("iframe")[0].contentWindow; // 窗口
                 parent.layer.close(index);
             }

         });
    }

    function showNodePic(flowId,taskId) {
        parent.layer.open({
            type:2,
            btn: ['关闭'],
            area: ['700', '300'],
            skin: 'layui-layer-lan',
            title: "流程图",
            shade: [0.5, '#393D49'],
            maxmin: true, //开启最大化最小化按钮
            content:"flow/graphics?definitionId="+flowId+"&taskId="+taskId,
            yes:function(index,frameDom){
                //var openFrame = $(frameDom).find("iframe")[0].contentWindow; // 窗口
                parent.layer.close(index);
            }

        });
    }
</script>

</body>
</html>
